<template>
    <div class="referee-detail-page-wrap hp100">
        <!-- <div style="color: rgb(27, 76, 184); margin-bottom: 15px">
            <div class="addressIcon"></div>
            <span>当前位置：</span>
            <span style="cursor: pointer" @click="$router.go(-1)">{{ pageTitle }}</span>
            <Icon type="ios-arrow-forward" color="rgb(27, 76, 184)" size="16" />
            <span style="color: #333">{{ this.sceneName }}</span>
        </div> -->
        <div class="page-content hp100">
            <Tabs v-model="curTab" @on-click="changeTab" class="demo-tabs-style2">
                <div slot="extra" class="flex">
                    <!-- <ChatRoom :drillId="sceneId" class="btn-chat" ref="chatRoom"></ChatRoom> -->
                    <Button type="primary" icon="md-add" ghost @click="boardModal = true">
                        发送公告</Button
                    >
                </div>
                <TabPane label="审核报告" name="report" key="report" :index="1">
                    <template v-if="curTab == 'report'">
                        <ReportPage v-if="hwType === 1" :extension="extension" :hwTypeExtension="hwTypeExtension"></ReportPage>
                        <OldReportPage  v-else :hwExtentionType='hwExtentionType' :hwTypeExtension="hwTypeExtension"></OldReportPage>
                    </template>
                </TabPane>
                <TabPane label="审核目标" name="target" key="target" :index="2" v-if="hwType === 1">
                    <DeclareTarget
                        :sceneId="sceneId"
                        :projectId="projectId"
                        v-if="curTab == 'target'"
                    ></DeclareTarget>
                </TabPane>
                <TabPane label="加减分管理" name="score" key="score" :index="3">
                    <div>
                        <div class="search-wrapper">
                            <Button @click="openScoreModal()">加减分</Button>
                            <Select filterable
                                v-model="scoreSearch.type"
                                filterable
                                clearable
                                transfer
                                placeholder="请选择加减分类型"
                                @on-change="getScoreManageList(1)"
                            >
                                <Option :value="2" title="加分">加分</Option>
                                <Option :value="1" title="减分">减分</Option>
                            </Select>
                            <!-- 老护网-->
                            <Select filterable
                                v-if="hwType === 0"
                                v-model="scoreSearch.target"
                                filterable
                                clearable
                                transfer
                                placeholder="请选择目标"
                                @on-change="getScoreManageList(1)"
                            >
                                <Option
                                    v-for="item in targetList"
                                    :value="item.id"
                                    :key="item.id"
                                    :title="item.company"
                                    >{{ item.company }}</Option
                                >
                            </Select>
                            <!-- 新护网-->
                            <Select filterable
                                v-if="hwType === 1"
                                v-model="scoreSearch.company"
                                filterable
                                clearable
                                transfer
                                placeholder="请选择单位"
                                @on-change="getScoreManageList(1)"
                            >
                                <Option
                                    v-for="item in companyList"
                                    :value="item"
                                    :key="item"
                                    :title="item"
                                    >{{ item }}</Option
                                >
                            </Select>
                            <Select filterable
                                v-model="scoreSearch.groupId"
                                filterable
                                clearable
                                transfer
                                placeholder="请选择团队"
                                @on-change="getScoreManageList(1)"
                            >
                                <Option
                                    v-for="item in allTeamList"
                                    :value="item.id"
                                    :key="item.id"
                                    :title="item.name"
                                    >{{ item.name }}</Option
                                >
                            </Select>
                            <Button @click="resetSearch"
                                ><i class="el-icon-refresh-right"
                            /></Button>
                        </div>
                        <TableList
                            :columns="scoreCol"
                            :data="scoreManageList"
                            :total="scoreTotal"
                            :page.sync="scoreSearch.page"
                            :size.sync="scoreSearch.pageSize"
                            @queryFun="getScoreManageList"
                        >
                        </TableList>
                    </div>
                </TabPane>
                <TabPane label="告警信息" name="alarm" key="alarm" :index="4" v-if="hwType === 1">
                    <div>
                        <div class="search-wrapper">
                            <i-select v-model="sceneRist" @on-change="changeSceneRist">
                                <!-- <i-option value="all">所有等级</i-option> -->
                                <i-option value="low">低危</i-option>
                                <i-option value="medium">中危</i-option>
                                <i-option value="high">高危</i-option>
                            </i-select>
                            <Input
                                v-model.trim="teamName"
                                clearable
                                placeholder="团队名称"
                                @on-change="searchTeamName"
                            />
                            <Button @click="resetSearchAlarm"
                                ><i class="el-icon-refresh-right"
                            /></Button>
                        </div>
                        <TableList
                            :columns="alarmCol"
                            :data="alarmList"
                            :total="alarmTotal"
                            :page.sync="alarmPage"
                            :size.sync="alarmPageSize" 
                            @queryFun="getAlarmList"
                        >
                        </TableList>
                    </div>
                </TabPane>
                <TabPane
                    label="攻击方排行统计"
                    name="teamRankStatic"
                    key="teamRankStatic"
                    :index="5"
                    v-if="hwType === 1"
                >
                    <teamRankStatic
                        v-if="curTab == 'teamRankStatic'"
                        :sceneId="sceneId"
                        :sceneName="sceneName"
                        :projectId="projectId"
                        :poll="true"
                    ></teamRankStatic>
                </TabPane>
                <TabPane
                    label="防守方排行统计"
                    name="defendRankStatic"
                    key="defendRankStatic"
                    :index="6"
                    v-if="hwTypeExtension !==0 && hwExtentionType !== 2 && projectType!==zcDrillName"
                >
                    <teamRankStatic
                        v-if="curTab == 'defendRankStatic'"
                        :sceneId="sceneId"
                        :sceneName="sceneName"
                        :projectId="projectId"
                        :poll="true"
                        :isDefend="true"
                    ></teamRankStatic>
                </TabPane>
                <TabPane label="高危攻击报备" name="attackReport" key="attackReport" :index="7" v-if="hwExtentionType == 2">
                <!-- <TabPane label="高危攻击报备" name="attackReport" key="attackReport" :index="7" v-if="hwType !== 0 || (hwType==0&&hwExtentionType==2)"> -->
                    <div>
                        <div class="search-wrapper">
                            <Input v-model.trim="reportName" clearable placeholder="报备名称" style="margin-left: 8px" @on-change="debounceFn"></Input>
                            <Select filterable v-model="aimSystem" filterable placeholder="目标系统" clearable style="margin-left: 8px" @on-change="debounceFn">
                                <Option :value="item" v-for="(item,index) in systemList" :key="index">{{item}}</Option>
                            </Select>
                            <Input v-model.trim="creatorName" clearable placeholder="提交人" style="margin-left: 8px" @on-change="debounceFn"></Input>
                            <Button @click="resetSearchTarget"
                                ><i class="el-icon-refresh-right"
                            /></Button>
                        </div>
                        <TableList
                            :columns="reportCol"
                            :data="reportList"
                            :total="reportTotal"
                            :page.sync="reportPageIndex"
                            size.sync="pageSizeReport"
                            @queryFun="getReportList"
                            style="max-height: fit-content"
                        ></TableList>
                    </div>
                </TabPane>

              <TabPane label="选手接入机器录屏" name="screenRecord" key="screenRecord" :index="8">
                <div v-if="curTab==='screenRecord'">
                  <screenController/>
                </div>
              </TabPane>
              <TabPane label="漏洞情况" name="vulnerabilityStats" key="vulnerabilityStats" :index="9">
                <VulnerabilityStats v-if="curTab==='vulnerabilityStats'" :sceneId="sceneId"></VulnerabilityStats>
              </TabPane>
            </Tabs>
        </div>
        <Modal v-model="showScoreModal" @on-visible-change="visibleChange" title="加减分">
            <Form
                ref="scoreModal"
                :model="scoreManageObj"
                :rules="scoreModalRules"
                :label-width="100"
            >
                <FormItem label="操作对象" prop="targetType">
                    <RadioGroup
                        v-model="scoreManageObj.targetType"
                        @on-change="
                            scoreManageObj.groupId = '';
                            scoreManageObj.company = '';
                        "
                    >
                        <Radio :label="0" :disabled="scoreManageObj.activeType === 'update'" v-if="!hideDw">
                            <span>{{ hwType === 1 ? '单位' : '目标' }}</span>
                        </Radio>
                        <Radio :label="1" :disabled="scoreManageObj.activeType === 'update'">
                            <span>团队</span>
                        </Radio>
                    </RadioGroup>
                </FormItem>
                <FormItem
                    label="目标"
                    v-if="hwType === 0 && scoreManageObj.targetType === 0"
                    prop="target"
                    key="target"
                >
                    <Select filterable
                        v-model="scoreManageObj.target"
                        :disabled="scoreManageObj.activeType === 'update'"
                        filterable
                        clearable
                        transfer
                        placeholder=""
                    >
                        <Option
                            v-for="item in targetList"
                            :value="item.id"
                            :key="item.id"
                            :title="item.company"
                            >{{ item.company }}</Option
                        >
                    </Select>
                </FormItem>
                <FormItem
                    label="单位"
                    v-if="hwType === 1 && scoreManageObj.targetType === 0"
                    prop="company"
                    key="company"
                >
                    <Select filterable
                        v-model="scoreManageObj.company"
                        :disabled="scoreManageObj.activeType === 'update'"
                        filterable
                        clearable
                        transfer
                        placeholder=""
                    >
                        <Option
                            v-for="item in companyList"
                            :value="item"
                            :key="item"
                            :title="item"
                            >{{ item }}</Option
                        >
                    </Select>
                </FormItem>
                <FormItem
                    label="团队"
                    v-if="scoreManageObj.targetType === 1"
                    prop="groupId"
                    key="group"
                >
                    <Select filterable
                        v-model="scoreManageObj.groupId"
                        :disabled="scoreManageObj.activeType === 'update'"
                        filterable
                        clearable
                        transfer
                        placeholder=""
                    >
                        <Option
                            v-for="item in teamList"
                            :value="item.id"
                            :key="item.id"
                            :title="item.name"
                            >{{ item.name }}</Option
                        >
                    </Select>
                </FormItem>
                <FormItem label="加减分类型" prop="type">
                    <RadioGroup v-model="scoreManageObj.type">
                        <Radio :label="2">
                            <span>加分</span>
                        </Radio>
                        <Radio :label="1">
                            <span>减分</span>
                        </Radio>
                    </RadioGroup>
                </FormItem>
                <FormItem label="分值" prop="score">
                    <Input v-model="scoreManageObj.score" number></Input>
                </FormItem>
                <FormItem
                    :label="`${scoreManageObj.type === 2 ? '加分' : '减分'}原因`"
                    prop="approvalInfo"
                >
                    <Input
                        v-model="scoreManageObj.approvalInfo"
                        :maxlength="200"
                        type="textarea"
                        :autosize="{ minRows: 2, maxRows: 5 }"
                    ></Input>
                </FormItem>
            </Form>
            <div slot="footer" class="footer">
                <Button type="text" size="large" @click="showScoreModal = false">取消</Button>
                <Button
                    type="primary"
                    size="large"
                    @click="saveScoreManage"
                    :loading="scoreManageObj.loading"
                    >确定</Button
                >
            </div>
        </Modal>
        <Modal v-model="boardModal" title="发送公告" :width="650" footer-hide>
            <board
                v-if="boardModal"
                @hideModal="hideModal"
                :sceneId="sceneId"
                :sceneName="sceneName"
            ></board>
        </Modal>
        <!-- 高危攻击报告审核弹窗 -->
        <Modal v-model="examineModal" title="高危攻击报备审核" :width="600" class-name="examine-modal-cp">
            <Card dis-hover>
                <template #title>申报详情</template>
                <Form :label-width="60">
                    <FormItem label="报备名称" style="margin-bottom:0">
                    {{ examineInfo.name }}
                    </FormItem>
                    <FormItem label="目标系统" style="margin-bottom:0">
                    {{ examineInfo.company }}
                    </FormItem>
                    <FormItem label="攻击说明" style="margin-bottom:0">
                    <p class="html-content target-des ql-editor" v-html="examineInfo.description"></p>
                    </FormItem>
                </Form>
            </Card>
            <Form ref="formExamine" :model="formExamine" :rules="ruleExamine" :label-width="80" style="margin-top: 15px;">
                <FormItem label="审核结果" prop="checkStatus">
                    <RadioGroup v-model="formExamine.checkStatus">
                        <Radio :label="1">通过</Radio>
                        <Radio :label="2">不通过</Radio>
                    </RadioGroup>
                </FormItem>
                <FormItem label="审核意见" prop="opinion">
                    <Input
                    v-model.trim="formExamine.opinion"
                    clearable
                    type="textarea"
                    :maxlength="1000"
                    :autosize="{ minRows: 4, maxRows: 8 }"
                    placeholder="审核意见"
                    ></Input>
                </FormItem>
            </Form>
            <div slot="footer">
                <Button @click="examineCancel">取消</Button>
                <Button type="primary" :loading="buttonLoading" @click="examineSubmit">确定</Button>
            </div>
        </Modal>
        <img-view ref="imgView"></img-view>
    </div>
</template>
<script>
import screenController from '@/view/drill_compete/page/screenController';
import ImgView from './img-view';
import $ from 'jquery';
import {
    getScoreManageList,
    addScoreManage,
    updateScoreManage,
    deleteScoreManage,
    getAlarmList,
    targetReportList, 
    targetExamine, 
    targetNameList
} from '@/api/referee.js';
import { getTopoTargetList, getDeclareCompanyList, getSceneInfo } from '@/api/drill_compete';
import { getaccessgrouplist } from '@/api/access_new';
import DeclareTarget from './declareTargetDrawer';
import ReportPage from './reportPage.vue';
import OldReportPage from '../referee_old/reportPage.vue';
import board from '@/components/board-cast/drillBoardcast.vue';
// import ChatRoom from '@/components/chatRoom/chatRoom';
import teamRankStatic from '@/view/drill_compete/page/statistics/hwTeamRankStatic.vue';
import VulnerabilityStats from './vulnerabilityStats'
import { parseJson, debounce } from '@/libs/utils';
export default {
    name: 'refereeDetail',
    components: {
       screenController,
        DeclareTarget,
        ReportPage,
        OldReportPage,
        board,
        // ChatRoom,
        teamRankStatic,
        ImgView,
        VulnerabilityStats
    },
    data() {
        const validateScore = (rule, value, callback) => {
            if (value) {
                if (!Number.isInteger(value)) {
                    callback(new Error('请输入整数'));
                } else {
                    if (value <= 0 || value > 100000) {
                        callback(new Error('请输入1-100000的整数'));
                        return;
                    } else {
                        callback();
                    }
                }
            } else {
                callback(new Error('不能为空'));
            }
        };
        return {
            sceneId: this.$route.query.sceneId,
            sceneName: this.$route.query.sceneName,
            projectId: this.$route.query.projectId,
            projectType: this.$route.query.projectType,
            zcDrillName:this.$store.getters.getMenuName('zcDrill'),
            boardModal: false,
            curTab: 'report',
            scoreModalRules: {
                company: [{ required: true, message: '请选择单位', trigger: 'change' }],
                groupId: [{ required: true, message: '请选择团队', trigger: 'change' }],
                type: [
                    {
                        required: true,
                        type: 'number',
                        message: '请选择加减分类型',
                        trigger: 'change',
                    },
                ],
                score: [{ required: true, validator: validateScore, trigger: 'change' }],
            },
            showScoreModal: false,
            scoreTotal: 0,
            targetList: [],
            teamList: [],
            allTeamList: [], // 包含管理员团队组
            scoreSearch: {
                page: 1,
                pageSize: 10,
                type: '',
                groupId: '',
                target: '',
            },
            hideDw:false,
            scoreManageObj: {
                // 添加、修改加减分的数据
                targetType: 0, // 0目标  1团队
                approvalInfo: '',
                company: '',
                groupId: '',
                target: '',
                score: '',
                type: 1,
                loading: false,
                activeType: 'add', // 区别是添加操作还是修改操作
            },
            scoreManageList: [],
            // 页面设置
            fullHeight: document.documentElement.clientHeight,
            fullWidth: document.documentElement.clientWidth,
            contentHei: 'auto',
            scoreCol: [
                {
                    title: '目标',
                    key: 'targetName',
                    width: 138,
                    tooltip: true,
                    show: () => {
                        return this.hwType === 0;
                    },
                },
                {
                    title: '单位',
                    key: 'company',
                    width: 138,
                    tooltip: true,
                    show: () => {
                        return this.hwType === 1;
                    },
                },
                {
                    title: '团队',
                    key: 'groupName',
                    width: 138,
                    tooltip: true,
                },
                {
                    title: '操作类型',
                    key: 'type',
                    width: 138,
                    tooltip: true,
                    placement: 'top-left',
                    render: (h, params) => {
                        return h('span', params.row.type === 2 ? '加分' : '减分');
                    },
                },
                {
                    title: '分值',
                    key: 'score',
                    width: 138,
                    tooltip: true,
                },
                {
                    title: '创建者',
                    key: 'creatorName',
                    width: 138,
                    tooltip: true,
                },
                {
                    title: '原因',
                    key: 'approvalInfo',
                    width: 138,
                    tooltip: true,
                },
                {
                    title: '操作',
                    key: 'action',
                    placement: 'top-right',
                    action: true,
                    opList:[
                        {
                            txt:'修改',
                            on: {
                                click: (data) => {
                                    this.showScoreModal = true;
                                    this.scoreManageObj = Object.assign(
                                        {
                                            targetType:
                                                data.company || data.targetName
                                                    ? 0
                                                    : 1, // 0目标  1团队
                                            loading: false,
                                            activeType: 'update',
                                        },
                                        data
                                    );
                                }
                            },
                        },
                        {
                            txt:'删除',
                            type:'delete',
                            tooltip:true,
                            title:'你确定要删除吗？',
                            on: {
                                click: (data) => {
                                    this.deleteScoreManage(data.id);
                                },
                            },
                        }
                    ],
                //     render: (h, params) => {
                //         return h('div', [
                //             h(
                //                 'Button',
                //                 {
                //                     props: {
                //                         type: 'primary',
                //                         size: 'small',
                //                     },
                //                     style: {
                //                         marginRight: '5px',
                //                     },
                //                     on: {
                //                         click: () => {
                //                             this.showScoreModal = true;
                //                             this.scoreManageObj = Object.assign(
                //                                 {
                //                                     targetType:
                //                                         params.row.company || params.row.targetName
                //                                             ? 0
                //                                             : 1, // 0目标  1团队
                //                                     loading: false,
                //                                     activeType: 'update',
                //                                 },
                //                                 params.row
                //                             );
                //                         },
                //                     },
                //                 },
                //                 '修改'
                //             ),
                //             h(
                //                 'Poptip',
                //                 {
                //                     props: {
                //                         confirm: true,
                //                         'ok-text': '确定',
                //                         'cancel-text': '取消',
                //                         type: 'error',
                //                         size: 'large',
                //                         title: '你确定要删除吗?',
                //                         transfer: true,
                //                     },
                //                     on: {
                //                         'on-ok': () => {
                //                             this.deleteScoreManage(params.row.id);
                //                         },
                //                     },
                //                 },
                //                 [
                //                     h(
                //                         'Button',
                //                         {
                //                             props: {
                //                                 type: 'error',
                //                                 size: 'small',
                //                             },
                //                             style: {
                //                                 marginRight: '5px',
                //                             },
                //                         },
                //                         '删除'
                //                     ),
                //                 ]
                //             ),
                //         ]);
                //     },
                },
            ],
            sceneStatus: 'running',
            companyList: [],
            alarmCol: [
                // {
                //   type: 'index',
                //   width: 60
                // },
                {
                    title: '攻击名称',
                    key: 'name',
                    ellipsis: true,
                    tooltip: true,
                    placement: 'top-left',
                },
                {
                    title: '队伍名称',
                    key: 'teamName',
                    width: 120,
                    ellipsis: true,
                    tooltip: true,
                },
                {
                    title: '攻击源IP',
                    key: 'src',
                    width: 120,
                    ellipsis: true,
                    tooltip: true,
                },
                {
                    title: '源端口',
                    key: 'sport',
                    width: 120,
                    ellipsis: true,
                    tooltip: true,
                },
                {
                    title: '攻击目标IP',
                    key: 'dst',
                    width: 120,
                    ellipsis: true,
                    tooltip: true,
                },
                {
                    title: '目标端口',
                    key: 'dport',
                    width: 120,
                    ellipsis: true,
                    tooltip: true,
                },
                {
                    title: 'vlan',
                    key: 'vlan',
                    width: 120,
                    ellipsis: true,
                    tooltip: true,
                },
                {
                    title: '协议',
                    key: 'protocol',
                    width: 120,
                    ellipsis: true,
                    tooltip: true,
                },
                {
                    title: '威胁程度',
                    key: 'risk',
                    width: 120,
                    render: (h, params) => {
                        return h('span', {}, this.sceneRisk(params.row.risk));
                    },
                },
                {
                    title: '告警描述',
                    key: 'description',
                    width: 220,
                    ellipsis: true,
                    tooltip: true,
                },
                {
                    title: '时间',
                    key: 'createTime',
                    width: 180,
                    ellipsis: true,
                    tooltip: true,
                },
            ],
            alarmModel: false,
            alarmId: '',
            alarmName: '',
            alarmTotal: 0,
            alarmList: [],
            alarmPage: 1,
            alarmPageSize: 12,
            sceneRist: '',
            teamName: '',
            drillDetail: {
                extension: '{}',
            },
            reportName: '', 
            creatorName: '', 
            aimSystem: '',
            systemList: [],
            reportPageIndex: 1,
            pageSizeReport: 10,
            reportList: [],
            reportTotal: 0,
            reportCol: [
                {
                    placement: 'top-left',
                    title: '报备名称',
                    key: 'name',
                    tooltip: true,
                    width: 200,
                },
                {
                    title: '目标系统',
                    key: 'company',
                    tooltip: true,
                    width: 200,
                },
                {
                    title:'提交人',
                    key:'creatorName',
                    width:100,
                    tooltip:true,
                },
                {
                    title: '目标IP',
                    key: 'ip',
                    width: 200,
                    tooltip: true,
                },
                {
                    title: '目标URL',
                    key: 'url',
                    width: 200,
                    tooltip: true,
                },
                {
                    type:'html',
                    title: '攻击说明',
                    key: 'description',
                    width: 200,
                    tooltip: true,
                    ellipsis: true,
                    // render: (h, params) => {
                    //     const regex = /<[^>]+>([^<]+)<\/[^>]+>/g;
                    //     const matches = regex.exec(params.row.description);
                    //     return h('Tooltip', {
                    //         props: {
                    //             'max-width': '300',
                    //             transfer: true,
                    //             content:matches && matches[1]
                    //         },
                    //         },
                    //         [
                    //             h('div', {
                    //                 class: 'desc-box',
                    //                 domProps: {innerHTML: params.row.description}
                    //             })
                    //         ])
                    // }
                },
                {
                    title: '状态',
                    key: 'checkstatus',
                    width: 200,
                    render: (h, params) => {
                        return h('div', [
                            h('span', (params.row.checkstatus == 0 && '未审核') || (params.row.checkstatus == 1 && '审核通过') || (params.row.checkstatus == 2 && '审核未通过'))
                        ])
                    }
                },
                {
                    title: '审核意见',
                    key: 'opinion',
                    width: 200,
                    tooltip: true,
                },
                {
                    title: '审核操作',
                    placement: 'top-right',
                    // action: true,
                    key:'action',
                    render:(h,params)=>{
                        return h('div',[
                            h('Button',{
                                props: {
                                    type: 'info',
                                    size: 'small',
                                    disabled: params.row.checkstatus != 0
                                },
                                on: {
                                    click: () => {
                                        this.showExamineModal(params.row)
                                    }
                                }
                            },'审核'),
                        ])
                    }
                },
            ],
            examineModal: false,
            examineInfo: {
                name: '',
                company: '',
                description: '',
            },
            formExamine: {
                checkStatus: '',
                opinion: '',
            },
            ruleExamine: {
                checkStatus: [{ required: true, type: 'number', trigger: 'change', message: '请选择审核结果'}],
                opinion: [{ required: true, message: '请填写审核意见', trigger: 'blur' }],
            },
            buttonLoading: false,
        };
    },
    computed: {
        extension() {
            return parseJson(this.drillDetail.extension);
        },
        hwType() { // 这个类型暂时不动，懒得改其他逻辑
            return this.extension.hwType === 0 ? 0 : 1;
        },
        hwTypeExtension() { // 重新定义一个类型出来 作为显示隐藏控制 
            // hwType  1 实网 2众测 3仿真
            return this.extension.hwType;
        },
        hwExtentionType(){
            return this.extension.hwExtentionType
        },
        pageTitle () {
            //当前菜单显示名
            return this.$store.getters.pageTitle;
        },
    },
    async created() {
        this._scoreManageObj = { ...this.scoreManageObj };
        this.systemList = await this.targetNameList()
    },
    watch: {
      showScoreModal(newv,odlv){
        // 众测演练的裁判系统，扣分蒋操作对象屏蔽，默认对团队进行扣分 ,加减分页面将单位选项去掉21681
        this.hideDw = this.projectType===this.$store.getters.getMenuName('zcDrill')
        if(this.hideDw) {
          this.scoreManageObj.targetType = 1
        }
      }


    },
    mounted() {
        this.$store.commit('addBreadItem', { name: this.sceneName });
        this.setStyle();
        this.getSceneInfo();
        $('.page-content .ivu-divider-horizontal').css({
            margin: '0px',
        });
        window.onresize = () => {
            this.setStyle();
        };
        

        
        
    },
    methods: {
        // 获取目标系统
        targetNameList() {
            return new Promise((resolve, reject) => {
                targetNameList(this.$route.query.projectId).then(({data}) => {
                    if(data.code == 1) {
                        resolve(data.data)
                    }
                })
            })
        },
        // 提交审核结果
        examineSubmit() {
            this.$refs.formExamine.validate(valid => {
                if(valid) {
                    this.buttonLoading = true
                    targetExamine(this.examineInfo.id, this.formExamine.checkStatus, this.formExamine).then(({data = {}}) => {
                        // console.log('审核',data)
                        if(data.code != 1) {
                            this.$Message.error(data.message)
                            return
                        }
                        this.$Message.success(data.message)
                        this.getReportList()
                        this.examineCancel()
                    }).finally(() => {
                        this.buttonLoading = false
                    })
                }
            })
        },
        // 审核取消
        examineCancel() {
            this.$refs.formExamine.resetFields()
            this.examineModal = false
        },
        // 显示审核弹窗
        showExamineModal(row) {
            this.examineModal = true
            this.examineInfo = row
            $('.target-des').on('click', 'img', (e) => {
                this.$refs.imgView.showModal(e.target);
            });
        },
        // 防抖方法-查询条件变更
        debounceFn: debounce(function() {
            this.changePageNum(1);
        }),
        changePageNum(val){
            this.reportPageIndex = val
            this.getReportList()
        },
        resetSearchTarget() {
            this.aimSystem = ''
            this.creatorName = ''
            this.reportName = ''
            this.changePageNum(1)
        },
        // 报告列表
        getReportList(){
            let params = {
                pageIndex: this.reportPageIndex,
                pageSize: this.pageSizeReport,
                name: this.reportName,
                creatorName: this.creatorName,
                company: this.aimSystem
            }
            targetReportList(this.$route.query.sceneId, params).then(({data = {}}) => {
                if(data.code != 1) {
                    this.$Message.error(data.message)
                    return
                }
                // console.log(data,'111')
                this.reportList = data.data.items
                this.reportTotal = data.data.total
            })
        },
        getSceneInfo() {
            getSceneInfo(this.sceneId).then((data) => {
                if (data.code == 1) {
                    this.drillDetail = data.data;
                }
            });
        },
        changeTab(val) {
            this.curTab = val;
            if (val == 'alarm') {
                this.resetSearchAlarm();
            } else if (val == 'score') {
                this.resetSearch();
                this.getDeclareCompanyList();
                this.getTargetList();
            }else if(val == 'attackReport') {
                this.changePageNum(1)
            }
        },
        // 加减分
        visibleChange(type) {
            if (!type) {
                this.$refs.scoreModal.resetFields();
                this.scoreManageObj = { ...this._scoreManageObj };
            }
        },
        // 重置条件并搜索
        resetSearch(noRefresh) {
            this.scoreSearch = {
                page: 1,
                pageSize: 10,
                type: '',
                groupId: '',
                target: '',
            };
            this.getScoreManageList();
        },
        openScoreModal() {
            this.showScoreModal = true;
            this.scoreManageObj.activeType = 'add';
        },
        getDeclareCompanyList() {
            getDeclareCompanyList(this.projectId)
                .then(({ code, data, message }) => {
                    if (code === 1) {
                        this.companyList = data;
                    } else {
                    }
                })
                .catch((error) => {});
        },
        // 攻击方获取团队的数据，防守方获取靶标的数据，并综合为统一的数组用于使用
        getTargetList() {
            Promise.all([
                getTopoTargetList({
                    ageIndex: 1,
                    pageSize: 2147483646,
                    projectId: this.projectId,
                }),
                getaccessgrouplist({
                    pageIndex: 1,
                    pageSize: 2147483646,
                    testId: this.sceneId,
                }),
            ])
                .then((res) => {
                    if (res.some((item) => item.code !== 1)) {
                        this.$Message.warning('获取团队、目标列表有误');
                    }
                    res.forEach((item, index) => {
                        if (item.code === 1) {
                            if (index === 0) {
                                // 查询的是靶标
                                this.targetList = (item.data && item.data.items) || [];
                            } else {
                                let list = (item.data && item.data.items) || [];
                                this.adminTeam =
                                    list.find((item) => item.creatorName === '内部服务用户') || {};
                                this.teamList =
                                    list.filter((item) => item.creatorName !== '内部服务用户') ||
                                    [];
                                this.allTeamList = list;
                            }
                        }
                    });
                })
                .catch(() => {
                    this.$Message.error('获取团队、目标列表异常');
                });
        },
        // 获取团队或者是目标的名称
        getOptionName(id, type) {
            let template = ((type === 0 ? this.targetList : this.teamList) || []).find(
                (item) => item.id === id
            );
            return template && template[type === 0 ? 'company' : 'name']; // 视情况获取不同的字段
        },
        // 获取加减分列表
        getScoreManageList(page) {
            if (page) {
                this.scoreSearch.page = page;
            }
            getScoreManageList(Object.assign(this.scoreSearch, { testId: this.sceneId }))
                .then(({ data = {} }) => {
                    let { code, message } = data;
                    data = data.data || {};
                    if (code !== 1) {
                        this.$Message.warning(message);
                        return;
                    }
                    this.scoreTotal = data.totalCount || 0;
                    this.scoreManageList = data.pageData || [];
                })
                .catch(() => {
                    this.$Message.error('获取加减分列表异常');
                });
        },
        // 创建或修改数据
        saveScoreManage() {
            this.$refs.scoreModal.validate((valid) => {
                if (valid) {
                    this.scoreManageObj.loading = true;
                    let data = Object.assign(this.scoreManageObj, {
                        // 操作团队时查询团队名称，否则设置为undefined
                        groupName:
                            this.scoreManageObj.targetType === 1
                                ? this.getOptionName(
                                      this.scoreManageObj.groupId,
                                      this.scoreManageObj.targetType
                                  )
                                : undefined,
                        // 操作目标时查询目标名称，否则设置为undefined
                        // targetName: this.scoreManageObj.targetType === 0 ? this.getOptionName(this.scoreManageObj.target, this.scoreManageObj.targetType) : undefined,
                        // company: this.scoreManageObj.targetType === 0 ? this.scoreManageObj.company : '',
                        projectId: this.projectId,
                        projectName: this.projectname,
                        testId: this.sceneId,
                        testName: this.sceneName
                    });
                    if (this.hwType === 1) {
                        data.company =
                            this.scoreManageObj.targetType === 0 ? this.scoreManageObj.company : '';
                    } else {
                        data.targetName =
                            this.scoreManageObj.targetType === 0
                                ? this.getOptionName(
                                      this.scoreManageObj.target,
                                      this.scoreManageObj.targetType
                                  )
                                : undefined;
                    }
                    if (this.scoreManageObj.targetType === 0) {
                        // 针对目标加减分，需要补全团队Id、团队名称
                        data.groupId = this.adminTeam.id?this.adminTeam.id:''
                        data.groupName = this.adminTeam.name? this.adminTeam.name:'';
                    }
                    let api =
                        this.scoreManageObj.activeType === 'add'
                            ? addScoreManage
                            : updateScoreManage;
                    let text = this.scoreManageObj.activeType === 'add' ? '添加' : '修改';
                    api(data)
                        .then(({ data = {} }) => {
                            let { code, message } = data;
                            if (code !== 1) {
                                this.$Message.warning(message);
                                return;
                            }
                            this.$Message.info(`${text}加减分成功`);
                            this.scoreManageObj.activeType === 'add'
                                ? this.resetSearch()
                                : this.getScoreManageList();
                            this.showScoreModal = false;
                        })
                        .catch(() => {
                            this.$Message.error(`${text}加减分异常`);
                        })
                        .finally(() => {
                            this.scoreManageObj.loading = false;
                        });
                }
            });
        },
        // 删除加减分
        deleteScoreManage(id) {
            deleteScoreManage(id)
                .then(({ data = {} }) => {
                    let { code, message } = data;
                    if (code !== 1) {
                        this.$Message.warning(message);
                        return;
                    }
                    this.$Message.info('删除成功');
                    if (this.scoreManageList.length === 1 && this.scoreSearch.page > 1) {
                        this.scoreSearch.page--;
                    }
                    this.getScoreManageList();
                })
                .catch(() => {
                    this.$Message.error('删除加减分异常');
                });
        },
        sceneStatusFilter(val) {
            switch (val) {
                case 'error':
                    return '已停止';
                case 'initialized':
                    return '初始化';
                case 'running':
                    return '运行中';
                case 'completed':
                    return '已完成';
                default:
                    return '未知状态';
            }
        },
        sceneRisk(val) {
            switch (val) {
                case 'low':
                    return '低危';
                case 'medium':
                    return '中危';
                case 'high':
                    return '高危';
                default:
                    return '未知状态';
            }
        },
        setStyle() {
            window.fullHeight = document.documentElement.clientHeight;
            window.fullWidth = document.documentElement.clientWidth;
            this.fullHeight = window.fullHeight;
            this.fullWidth = window.fullWidth;
            this.contentHei = this.fullHeight - 60 - 33 + 'px'; // 80是头部高度  60是上下padding
        },
        // 告警信息列表
        toAlarmPage(row) {
            this.alarmName = row.name;
            this.alarmId = row.id;
            this.getAlarmList();
            this.alarmModel = true;
        },
        closeAlarmModel() {
            this.alarmName = '';
            this.alarmPage = 1;
            this.alarmId = '';
            this.teamName = '';
            this.sceneRist = '';
            this.alarmModel = false;
        },
        resetSearchAlarm() {
            this.teamName = '';
            this.sceneRist = '';
            this.alarmPage = 1;
            this.alarmPageSize = 12;
            this.getAlarmList();
        },
        changeAlarmPageNum(val) {
            this.alarmPage = val;
            this.getAlarmList();
        },
        changeSceneRist(val) {
            this.sceneRist = val;
            this.getAlarmList();
        },
        searchTeamName() {
            this.getAlarmList();
        },
        getAlarmList() {
            let params = {
                pageIndex: this.alarmPage,
                pageSize: this.alarmPageSize,
                relativeld: this.$route.query.sceneId,
            };
            if (this.sceneRist) {
                params.risk = this.sceneRist;
            }
            if (this.teamName) {
                params.teamName = this.teamName;
            }
            getAlarmList(params)
                .then((res) => {
                    if (res.data.code == 1) {
                        this.alarmList = res.data.data.items;
                        this.alarmTotal = res.data.data.total;
                    } else {
                        this.alarmList = [];
                        this.alarmTotal = 0;
                    }
                })
                .catch((error) => {
                    this.$Message.error(error);
                });
        },
        downloadReport(scene) {
            let sceneId = scene.id;
            let sceneName = scene.name;
            let href = `/api/compete/scoring/exportReport/${sceneId}/${sceneName}`;
            let a = document.createElement('a');
            document.body.appendChild(a);
            a.href = href;
            a.download = ''; //命名下载名称
            a.click(); //点击触发下载
            a.remove();
        },
        hideModal() {
            this.boardModal = false;
        },
    },
};
</script>
<style scoped>
.search-wrapper {
    display: flex;
    justify-content: flex-end;
    margin: 15px 0;
}
.search-wrapper /deep/ .ivu-select {
    width: 150px;
}
.search-wrapper /deep/ .ivu-input-wrapper {
    width: 180px;
}
.search-wrapper /deep/ .ivu-btn,
.search-wrapper /deep/ .ivu-select,
.search-wrapper /deep/ .ivu-input-wrapper {
    margin-left: 12px;
}
.score-drawer /deep/ .ivu-table {
    max-height: calc(100vh - 200px);
    overflow-y: auto;
}
.referee-detail-page-wrap {
    /* padding: 0 30px 30px; */
}
.page-content {
    background-color: #fff;
    border-radius: 10px;
    overflow: hidden;
    /* height: calc(100vh - 60px - 33px); */
}
.table-wrap {
    padding: 0 20px;
    /*height: calc(100% - 94px);
          overflow-x: hidden;
          overflow-y: auto;*/
}
.table-wrap::-webkit-scrollbar {
    /*滚动条整体样式*/
    width: 8px; /*高宽分别对应横竖滚动条的尺寸*/
    height: 6px;
}
.table-wrap::-webkit-scrollbar-thumb {
    /*滚动条里面小方块样式*/
    border-radius: 5px;
    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    background: rgba(209, 209, 209, 0.6);
}
.table-wrap::-webkit-scrollbar-track {
    /*滚动条里面轨道样式*/
    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    border-radius: 5px;
    background: rgba(179, 179, 179, 0.1);
}
.img-header {
    display: flex;
    justify-content: space-between;
    padding: 20px 20px 0 20px;
}
.deviceDrawer /deep/ .ivu-drawer-body {
    overflow: inherit;
}
/deep/.referee-detail-page-wrap .defGraphWrap {
    height: calc(100vh - 232px);
}
.addressIcon {
    display: inline-block;
    height: 14px;
    width: 12px;
    background: url('../../assets/globalIcon/addressIcon.png') no-repeat center;
    background-size: 100% 100%;
    margin-bottom: -2px;
}
.flex {
    display: flex;
    align-items: center;
}
.btn-chat {
    margin-right: 5px;
}
</style>
<style>
#setOverflowDraw .ivu-drawer-body {
    overflow: inherit;
}
.desc-box {
    white-space: normal;
}
.desc-box img {
    width: 100%;
}
</style>
